<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>用户登录</title>
        <script src="/lib/axios.js"></script>
        <script src="/lib/vue.js"></script>
        <link rel="stylesheet" href="/lib/elementindex.css">
        <script src="/lib/elementindex.js"></script>
        <style>
            .center{
           position: absolute;
           left: 50%;
           top: 50%;
           transform: translate(-50%,-50%); 
         }
        </style>
    </head>
    <body class='center'>
        <div id='app'>
            <el-card style='width: 400px;'>
                <div slot="header" style="text-align: center; font-size: large;">
                    <span>风控决策引擎</span>
                </div>
                <el-form ref='userform' :model='user' label-width="auto">
                    <el-form-item label="登录账号:" prop='usercode' :rules="[{
                        required: true,
                        message: '请输入登录账号',
                        trigger: 'blur'
                    }
                ]">
                        <el-input v-model="user.usercode" placeholder="请输入登录账号"></el-input>
                    </el-form-item>
                    <el-form-item label="登录密码:" prop='userpwd' :rules="[{
                        required: true,
                        message: '请输入登密码',
                        trigger: 'blur'
                    }
                ]">
                        <el-input type="password" v-model="user.userpwd" placeholder="请输入登录密码"></el-input>
                    </el-form-item>

                    <el-form-item label="录入新密码:" prop='newpwd' :rules="[{
                        required: true,
                        message: '请输入新的登录密码',
                        trigger: 'blur'
                    },
                    {
                        min: 6,
                        max: 30,
                        message: '长度在 6 到 30 个字母/数字/特殊字符构成.',
                        trigger: 'blur'
                    }
                ]">
                        <el-input type="password" v-model="user.newpwd" placeholder="请输入新的登录密码"></el-input>
                    </el-form-item>

                    <el-form-item label="再次录入新密码:" prop='newpwd2' :rules="[{
                        required: true,
                        message: '请再次输入新的登录密码',
                        trigger: 'blur'
                    }
                ]">
                        <el-input type="password" v-model="user.newpwd2" placeholder="请再次输入新的登录密码"></el-input>
                    </el-form-item>

                    <el-form-item label="">
                        <el-button type="primary" @click='handleUpdate'>修改密码</el-button>
                    </el-form-item>
                </el-form>
            </el-card>
        </div>

        <script type='module'>
            import * as $util from '/lib/hc-util.js'
            import * as $rest from '/lib/hc-rest-service.js'
            
            window.vm = new Vue({
                el: '#app',
                data: {
                    user:{
                        usercode: '',
                        userpwd: '',
                        newpwd:'',
                        newpwd2:'',
                    },
                    promptmsg:$util.getUrlArgOrDefault('redirect','')?'账号未登录，请登录后访问':'',
                },
                methods: {
                    handleUpdate: function() {
                        let self = this;
                        if(self.user.newpwd !== self.user.newpwd2)
                        {
                            self.$message({type:'error',message:'两次输入的新密码不相等'});
                            return false;
                        };
                        this.$refs['userform'].validate((valid) => {
                            if (valid) {
                                $rest.postdata("/admin/changePwd",self.user,function(data){
                                    self.$message({type:'success',message:'密码修改成功'});
                                });
                            } else {
                                return false;
                            }
                        });
                    },
                },
            });
            
            $rest.getdata("/admin/user",function(usr){
                vm.user.usercode = usr.code;
            })
            
        </script>
    </body>
</html>
